<template>

    <!--首页轮播图-->
    <el-carousel trigger="click"
                 :interval="100000"
                 :direction="direction"
                 :type="type"
                 width="fit-content"
                 :height="height">
        <el-carousel-item v-for="(img, index) in imgArr" :key="index">
            <img :src="staticPrefix + img.src" @click="goto(img.detail)" alt="轮播图" class="img"><!-- width="937px" height="400px"-->
        </el-carousel-item>
    </el-carousel>

</template>

<script>
    import settings from '@/settings'

    export default {
        name: "Carousel",
        props:['direction','height','imgArr','type'],
        data(){
            return {
                staticPrefix: settings.staticPrefix,

            }
        },
        methods: {
            goto(page){
                this.$router.push(page)
            },
        },
        beforeMount(){
            //console.log("轮播图数据",this.imgArr)
        }
    }
</script>

<style scoped>
    .el-carousel__item{
        display: flex;
        justify-content: center;
    }
    .el-carousel__item img{
        height: 100%;
    }


</style>
